<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>彩云小译扩展程序选项</title>
    <link href="./css/options.css" rel="stylesheet" />
    <link href="./css/materialize.css" rel="stylesheet" />
  </head>

  <body>
    <div class="container">
      <div class="main">
        <div class="logo-name"><img src="images/logo-name.png" /></div>
        <div id="version">0.3.0</div>
        <div class="collection col">
          <div class="switch collection-item">
            <span id="optionsAutoSWT">启动划词翻译</span>
            <label class="secondary-content">
              <input type="checkbox" id="select_translate" />
              <span class="lever"></span>
            </label>
          </div>
          <div class="switch collection-item">
            <span id="showDirectly">直接显示划译结果</span>
            <label class="secondary-content">
              <input type="checkbox" id="directTranslation" />
              <span class="lever"></span>
            </label>
          </div>
          <div class="switch collection-item">
            <span id="optionsAutoWebTrs">英文、日文网页自动翻译成中文</span>
            <label class="secondary-content">
              <input type="checkbox" id="auto_trs" />
              <span class="lever"></span>
            </label>
          </div>
        </div>

        <div class="collection col">
          <!-- <div class="switch collection-item">
                  启用视频翻译
                  <label class="secondary-content">
                    <input type="checkbox" id="video_translate">
                    <span class="lever"></span>
                  </label>
              </div> -->
          <div class="select-item collection-item">
            <span id="defaultTrsDirect">视频翻译默认方向</span>
            <div class="secondary-content">
              <select class="browser-default" id="select_transDirect">
                <option id="transZh2En" selected>中 >> 英</option>
                <option id="transEn2Zh">英 >> 中</option>
                <option id="transJp2Zh">日 >> 中</option>
              </select>
            </div>
          </div>
          <div class="collection-item select-item">
            <span id="defaultSubtype">视频翻译默认显示</span>
            <div class="secondary-content">
              <select class="browser-default" id="select_subType">
                <option selected id="optionBil">双语对照</option>
                <option id="optionSource">只显示原文</option>
                <option id="optionTarget">只显示译文</option>
              </select>
            </div>
          </div>
          <div class="select-item collection-item">
            <span id="defaultAudioApi">语音朗读默认工具</span>
            <div class="secondary-content">
              <select class="browser-default" id="select_audioApi">
                <option id="youdao" selected>朗读工具1</option>
                <option id="baidu">朗读工具2</option>
              </select>
            </div>
          </div>
          <div class="select-item collection-item">
            <span id="readingSpeed">语音朗读语速</span>
            <div class="secondary-content">
              <input type="range" min="1" max="9" value="5" id="audioSpeed" />
            </div>
          </div>
        </div>

        <div class="collection col">
          <a
            href="https://fanyi.caiyunapp.com/#/?utm_source=extension&utm_medium=options&utm_content=textlink"
            class="collection-item"
            target="_blank"
            id="textDocTrs"
            >在线文本翻译、文档翻译</a
          >
          <a
            href="https://fanyi.caiyunapp.com/#/mine/doc?utm_source=extension&utm_medium=options&utm_content=textlink"
            class="collection-item"
            target="_blank"
            id="UserCenter"
            >个人中心</a
          >
          <a
            href="https://fanyi.caiyunapp.com/#/app?utm_source=extension&utm_medium=options&utm_content=textlink"
            class="collection-item"
            target="_blank"
            id="xiaoyiApp"
            >彩云小译App</a
          >
          <a
            href="https://support.qq.com/products/107129/?utm_source=extension&utm_medium=options&utm_content=textlink"
            class="collection-item"
            target="_blank"
            id="feedback"
            >意见反馈</a
          >
        </div>
      </div>
    </div>

    <div id="update-modal" class="modal">
      <div class="modal-content">
        <h5>版本更新说明</h5>
        <p>1. 小译控件组优化成抽屉式，添加控制、选项按钮</p>
        <p>2. bug修复，体验优化</p>
      </div>
      <div class="modal-footer">
        <a href="#!" class="modal-close waves-effect waves-green btn-flat"
          >OK</a
        >
      </div>
    </div>

    <script src="options.js"></script>
    <script src="js/materialize.min.js"></script>
  </body>
</html>
